<template>
	<view class="bgf8">
		<view class="h202">
			<view class="w93">
				<image :src="avatar" mode=""></image>
				<view style="height: 100rpx;margin-left: 30rpx;color: #FFFFFF;margin-top: 15rpx;">
					<text class="fs32" style="display: block;">{{nickname}}</text>
					<text class="fs28" style="display: block;margin-top: 15rpx;">136 9885 4362</text>
				</view>
				<view class="port fs12">
					未实名
				</view>
			</view>
		</view>
		<!-- 我的订单 -->
		<view class="w343" style="height: 244rpx;margin: 0 auto;margin-top: -50rpx;">
			<view class="w90" style="line-height: 104rpx;">
				<h5 style="font-weight: 700;">我的订单</h5>
				<text class="fs12">全部</text>
				<i></i>
			</view>
			<view style="width: 90%;display: flex;margin: 0 auto;">
				<view class="Mimg" style="">
					<navigator url="./Dzhifu/Dzhifu">
						<image src="../../static/icon824.png" mode=""></image>
						<view class="fs12" style="text-align: center;">待支付</view>
					</navigator>
				</view>
				<view class="Mimg" style="">
					<navigator url="./Dpeisong/Dpeisong">
						<image src="../../static/icon863.png" mode=""></image>
						<view class="fs12" style="text-align: center;">待配送</view>
					</navigator>
				</view>
				<view class="Mimg" style="">
					<navigator url="./Dshouhuo/Dshouhuo">
						<image src="../../static/icon2864.png" mode=""></image>
						<view class="fs12" style="text-align: center;">待收货</view>
					</navigator>

				</view>
				<view class="Mimg" style="">
					<navigator url="./Dpinjia/Dpinjia">
						<image src="../../static/icon5825.png" mode=""></image>
						<view class="fs12" style="text-align: center;">待评价</view>
					</navigator>

				</view>
			</view>
		</view>
		<!-- 我的拼团 -->
		<navigator url="../pintuan/pintuan">
			<view class="w343" style="height: 84rpx;margin: 0 auto;margin-top: 40rpx;line-height: 84rpx;">
				<h5 style="margin-left: 34rpx;">我的拼团</h5>
				<i></i>
				<b></b>
			</view>
		</navigator>
		<!-- 广告 -->
		<image class="imggg" src="../../static/icon0.png" mode=""></image>
		<!-- 服务 -->
		<view class="w343" style="height: 444rpx; margin: 0 auto;">
			<view
				style="width: 90%;height: 110rpx;margin:0 auto;border-bottom: 2rpx solid rgba(243,243,243,1);line-height: 110rpx;">
				<h5 class="fs14">服务</h5>
			</view>
			<view style="width: 90%;display: flex;margin: 0 auto;flex-wrap: wrap; ">
				<view class="Mimg" style="">
					<navigator url="../Location/Location">
						<image src="../../static/icon5828.png" mode=""></image>
						<view class="fs12" style="text-align: center;">地址管理</view>
					</navigator>
				</view>
				<view class="Mimg" style="">
					<navigator url="../PingJia/PingJia">
						<image src="../../static/icon2867.png" mode=""></image>
						<view class="fs12" style="text-align: center;">我的评价</view>
					</navigator>
				</view>
				<view class="Mimg" style="">
					<navigator url="../ShimingRenzheng/SQrz/SQrz">
						<image src="../../static/icon2865.png" mode=""></image>
						<view class="fs12" style="text-align: center;">商家入驻</view>
					</navigator>
				</view>
				<view class="Mimg" style="">
					<navigator url="../ShimingRenzheng/CWqs/CWqs">
						<image src="../../static/icon5830.png" mode=""></image>
						<view class="fs12" style="text-align: center;">成为骑手</view>
					</navigator>
				</view>
				<view class="Mimg" style="">
					<navigator url="../ShimingRenzheng/ShimingRenzheng">
						<image src="../../static/icon866.png" mode=""></image>
						<view class="fs12" style="text-align: center;">实名认证</view>
					</navigator>
				</view>
				<view class="Mimg" style="">
					<navigator url="">
						<image src="../../static/icon5827.png" mode=""></image>
						<view class="fs12" style="text-align: center;">客服中心</view>
					</navigator>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import { mapState } from 'vuex'
	export default {
		data() {
			return {

			}
		},
		methods: {

		},
		computed:{
			...mapState(['avatar','nickname','longitude'])
		}
	}
</script>

<style>
	.h202 {
		height: 404rpx;
		border-radius: 0rpx 0rpx 80rpx 80rpx;
		background: rgba(36, 188, 129, 1);
	}

	.w93 {
		width: 93%;
		height: 148rpx;
		float: right;
		padding-top: 140rpx;
		position: relative;
		display: flex;
	}

	.w93>image {
		width: 128rpx;
		height: 128rpx;
		border-radius: 50%;
	}

	.w90 {
		width: 90%;
		height: 104rpx;
		border-bottom: 1rpx solid rgba(243, 243, 243, 1);
		margin: 0 auto;
		position: relative;
	}

	.w90>text {
		color: rgba(164, 164, 164, 1);
		position: absolute;
		right: 30rpx;
		top: 0rpx;
	}

	.w90>i {
		width: 10rpx;
		height: 20rpx;
		background: url(../../static/iconfhn.png);
		position: absolute;
		right: 0;
		top: 44rpx;
	}

	.port {
		width: 118rpx;
		height: 46rpx;
		text-align: center;
		line-height: 46rpx;
		color: rgba(255, 255, 255, 1);
		background: rgba(242, 242, 242, 0.6);
		border-radius: 30rpx 0 0 30rpx;
		position: absolute;
		right: 0;
		top: 200rpx;
	}

	.w343 {
		width: 686rpx;
		background: #FFFFFF;
		border-radius: 16rpx;
		position: relative;
	}

	.w343>i {
		width: 30rpx;
		height: 36rpx;
		position: absolute;
		left: 155rpx;
		top: 24rpx;
		background: url(../../static/icon2905.png);
	}

	.w343>b {
		width: 10rpx;
		height: 20rpx;
		background: url(../../static/iconfhn.png);
		position: absolute;
		right: 40rpx;
		top: 30rpx;
	}

	.Mimg {
		width: 25%;
	}

	.Mimg>navigator>image {
		display: block;
		width: 32rpx;
		height: 30rpx;
		margin: 28rpx auto;
	}

	.imggg {
		display: block;
		width: 720rpx;
		height: 182rpx;
		margin: 20rpx auto;
	}
</style>
